
import { getType } from '@/utils/index';
import { mapValues } from "lodash-es";

export const defaultTextTemplates = [
  {
    text: '大标题',
    fontSize: '30px',
    fontWeight: 'bold',
    tag: 'h2'
  },
  {
    text: '正文内容',
    tag: 'p'
  },
  {
    text: '链接内容',
    color: '#1890ff',
    textDecoration: 'underline',
    tag: 'a'
  },
  {
    text: '按钮内容',
    color: '#ffffff',
    backgroundColor: '#1890ff',
    borderWidth: '1px',
    borderColor: '#1890ff',
    borderStyle: 'solid',
    borderRadius: '2px',
    paddingLeft: '10px',
    paddingRight: '10px',
    paddingTop: '5px',
    paddingBottom: '5px',
    width: '100px',
    tag: 'button',
    textAlign: 'center'
  },
]


export const commonDefaultProps = {
  // actions
  actionType:'',
  url:'',
  // size
  height:'',
  width:'318px',
  paddingLeft:'0px',
  paddingRight:'0px',
  paddingTop:'0px',
  paddingBottom:'0px',
  // border type
  borderStyle:'none',
  borderColor:'#000',
  borderWidth:'0',
  borderRadius:'0',
  // shadow and opacity
  boxShadow:'0 0 0 #000000',
  opacity: 1,
  //position and x,y
  position:'absolute',
  left:'0',
  top:'0',
  right:'0'
}

export const textDefaultProps = {
  text:'正文内容',
  fontSize:'14px',
  fontFamily:'',
  fontWeight: 'normal',
  fontStyle:'normal',
  textDecoration:'none',
  lineHeight:'1',
  textAlign: 'left',
  color:'#000000',
  backgroundColor:'',
  ...commonDefaultProps
}

export const transformToComponentProps = <T extends { [key: string]: any }>(props: T) => {
  return mapValues(props, (item) => {
    return {
      type: item.constructor,
      default: item
    }
  })
}

export const textTransform = {
  tag: {
    type: String,
    default: 'div'
  },
  ...transformToComponentProps(textDefaultProps)
} 
